<template>
    <div class="app-container">
      <!--搜索-->
      <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="120px">
  
        <el-form-item label="卫生检查日期" prop="checkDate">
          <el-date-picker v-model="queryParams.checkDate" size="small"
                  style="width: 140px" value-format="yyyy-MM-dd"/>
        </el-form-item>
  
        <el-form-item label="卫生检查时段" prop="checkTimeSpan">
          <el-select v-model="queryParams.checkTimeSpan" size="small" placeholder="请选择" clearable>
            <el-option
                v-for="dict in checkTimeSpanOptions"
                :key="dict.dictValue"
                :label="dict.dictLabel"
                :value="dict.dictValue"
            />
          </el-select>
        </el-form-item>
  
        <el-form-item label="卫生评级" prop="grade">
          <el-select v-model="queryParams.grade" size="small" placeholder="请选择" clearable>
            <el-option
                v-for="dict in gradeOptions"
                :key="dict.dictValue"
                :label="dict.dictLabel"
                :value="dict.dictValue"
            />
          </el-select>
        </el-form-item>
  
        <el-form-item>
          <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
          <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
        </el-form-item>
      </el-form>
  
      <!--按钮区-->
      <el-row :gutter="10" class="mb8">
        <el-col :span="1.5">
          <el-button
            type="danger"
            icon="el-icon-delete"
            size="mini"
            :disabled="multiple"
            @click="handleDelete"
            v-hasPermi="['smartdor:sdhygiene:remove']"
          >删除</el-button>
        </el-col>
      </el-row>
  
      <!--表格区-->
      <el-table v-loading="loading" :data="sdhygieneList" @selection-change="handleSelectionChange">
        <el-table-column type="selection" align="center" />
        <el-table-column label="序号" align="center" prop="id" />
        <el-table-column label="检查日期" align="center" prop="checkDate"/>
        <el-table-column label="检查时段" align="center" prop="checkTimeSpan" :formatter="checkTimeSpanFormat"/>
        <el-table-column label="评级" align="center" prop="grade" :formatter="gradeFormat"/>
  
        <el-table-column label="宿舍栋号" align="center" prop="buildingNo" :formatter="buildingNoFormat" />
        <el-table-column label="楼层" align="center" prop="storey" :formatter="storeyFormat" />
        <el-table-column label="宿舍号" align="center" prop="dormitoryNo" />
        <el-table-column label="检查人" align="center" prop="checkUser" />
       
        <el-table-column label="创建时间" align="center" prop="createTime" width="160">
          <template slot-scope="scope">
            <span>{{ parseTime(scope.row.createTime) }}</span>
          </template>
        </el-table-column>
  
        <el-table-column label="操作" align="center" width="100" >
          <template slot-scope="scope">
            <el-button
                    size="mini"
                    circle type="danger"
                    icon="el-icon-delete"
                    @click="handleDelete(scope.row)"
                    v-hasPermi="['smartdor:sdhygiene:remove']"
            />
          </template>
        </el-table-column>
      </el-table>
  
      <pagination
        v-show="total>0"
        :total="total"
        :page.sync="queryParams.pageNum"
        :limit.sync="queryParams.pageSize"
        @pagination="getList"
      />
    </div>
  </template>
  
  <script>
  import { exportSdHygiene} from "@/api/smartdor/sdhygiene";
  import { listDormitoryHygiene,delDormitoryHygiene } from "@/api/smartdor/dorHygiene";
  
  export default {
    name: "SdHygiene",
    data() {
      return {
        // 遮罩层
        loading: true,
        // 选中数组
        ids: [],
        // 非单个禁用
        single: true,
        // 非多个禁用
        multiple: true,
        // 总条数
        total: 0,
        // 字典表格数据
        sdhygieneList: [],
        // 宿舍栋号
        buildingNoOptions: [],
        // 楼层
        storeyOptions: [],
        //卫生评级
        gradeOptions: [],
        //检查时段
        checkTimeSpanOptions: [],
        // 查询参数
        queryParams: {
          pageNum: 1,
          pageSize: 10,
          checkDate: undefined,
          checkTimeSpan: undefined,
          grade: undefined
        },
      };
    },
    created() {
      this.getList();
  
      this.getDicts("sys_building").then(response => {
        this.buildingNoOptions = response.data;
      });
      this.getDicts("sys_storey").then(response => {
        this.storeyOptions = response.data;
      });
      this.getDicts("grade").then(response => {
        this.gradeOptions = response.data;
      })
      this.getDicts("checkTimeSpan").then(response => {
        this.checkTimeSpanOptions = response.data;
      })
    },
    methods: {
      /** 查询宿舍卫生列表 */
      getList() {
        this.loading = true;
        listDormitoryHygiene(this.queryParams).then(response => {
            this.sdhygieneList = response.data.list;
            this.total = response.data.total;
            this.loading = false;
          }
        );
      },
      checkTimeSpanFormat(row,column) {
        return this.selectDictLabel(this.checkTimeSpanOptions,row.checkTimeSpan)
      },
      gradeFormat(row,column) {
        return this.selectDictLabel(this.gradeOptions,row.grade)
      },
      buildingNoFormat(row, column) {
        return this.selectDictLabel(this.buildingNoOptions, row.buildingNo);
      },
      storeyFormat(row, column) {
        return this.selectDictLabel(this.storeyOptions, row.storey);
      },
      /** 搜索按钮操作 */
      handleQuery() {
        this.queryParams.pageNum = 1;
        this.getList();
      },
      /** 重置按钮操作 */
      resetQuery() {
        this.resetForm("queryForm");
        this.handleQuery();
      },
      // 多选框选中数据
      handleSelectionChange(selection) {
        this.ids = selection.map(item => item.id)
        this.single = selection.length!==1
        this.multiple = !selection.length
      },
      /** 删除按钮操作 */
      handleDelete(row) {
        const ids = row.id || this.ids;
        this.$confirm('是否确认删除卫生信息编号为"' + ids + '"的数据项?', "警告", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          }).then(function() {
            return delDormitoryHygiene(ids);
          }).then(() => {
            this.getList();
            this.msgSuccess("删除成功");
          }).catch(function() {});
      },
      /** 导出按钮操作 */
      handleExport() {
        const queryParams = this.queryParams;
        this.$confirm('是否确认导出所有卫生信息数据项?', "警告", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          }).then(function() {
            return exportSdHygiene(queryParams);
          }).then(response => {
            this.download(response.msg);
          }).catch(function() {});
      }
    }
  };
  </script>
  